<template>
  <div>
    <r-search
      ref="search"
      :searchData="searchData"
      :searchForm="searchForm"
      :searchHandle="searchHandle"
      :inline="true"
    />

    <r-table
      :isPagination="true"
      :isHandle="true"
      :tableData="tableData"
      :tableCols="tableCols"
      :tablePage="pagination"
      :loading="tableLoading"
      :tableHandles="tableHandles"
      :isSelection="false"
      @refresh="page()"
    />

    <el-dialog width="450px" :title="renewalTitle" :visible.sync="renewalShow">
      <el-form :model="formData" :rules="formRules" ref="ruleForm">
        <el-form-item label="Review Remarks" label-width="140px" prop="remark">
          <el-input type="textarea" v-model="formData.remark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="renewalShow = false">Cancel</el-button>
        <el-button type="primary" @click="affirmAgentFn('ruleForm')"
          >Confirm</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      searchData: {
        type: "501", //推广提现
        orderNo: "", //Order Nnumber
        status: null, //提现Status  0 Pending Review 1提现完成 2Review Reject 3  提现Failure(转账Failure)
        beginTime: "", //Start Time
        endTime: "", //End Time
        userId: "", //Userid
        phone: "", //Phone
        userName: "" //Username
      },
      searchForm: [
        {
          type: "input",
          placeholder: "Order Nnumber",
          prop: "orderNo",
          width: 240
        },
        // {
        // 	type: "date", placeholder: "Start Date", prop: "beginTime", width: 170, change: (val) => { this.searchData.beginTime = val }
        // },
        // {
        // 	type: "date", placeholder: "End Date", prop: "endTime", width: 170, change: (val) => { this.searchData.endTime = val }
        // },

        {
          type: "select",
          placeholder: "Withdrawal  Status",
          prop: "status",
          width: 280,
          options: [
            { label: "Pending Review", value: "0" },
            { label: "Withdrawal Accomplish", value: "1" },
            { label: "Review Reject", value: "2" },
            { label: "Withdrawal Failure", value: "3" }
          ]
        },
        { type: "input", placeholder: "Phone", prop: "phone", width: 180 },
        {
          type: "input",
          placeholder: "User Name",
          prop: "userName",
          width: 220
        }
      ],
      searchHandle: [
        {
          type: "primary",
          label: "Search",
          plain: true,
          handle: e => {
            this.zeroFn();
            this.getData();
          }
        },
        {
          label: "Reset",
          buttonss: true,
          icon: "el-icon-refresh-right",
          handle: e => {
            this.searchData = {
              type: "501", //推广提现
              orderNo: "", //Order Nnumber
              status: null, //提现Status  0 Pending Review 1提现完成 2Review Reject 3  提现Failure(转账Failure)
              beginTime: "", //Start Time
              endTime: "", //End Time
              userId: "", //Userid
              phone: "", //Phone
              userName: "" //Username
            };
            this.zeroFn();
            this.getData();
          }
        }
      ],
      tableLoading: false,
      tableData: [],
      tableCols: [
        { label: "Order Number", prop: "orderNo" },
        { label: "User Name", prop: "userName" },
        { label: "Phone", prop: "phone" },
        {
          label: " User Type",
          prop: "userType",
          formatter: e =>
            e.userType == 1 ? "WeChat" : e.userType == 2 ? "Alipay" : "--"
        },
        {
          label: "Withdrawal Amount",
          prop: "money",
          formatter: e => (e.money ? "$" + e.money : "--")
        },
        {
          label: "Withdrawal Status",
          prop: "status",
          itemClass: e =>
            e.status == 1
              ? "success"
              : e.status == 2 || e.status == 3
              ? "danger"
              : "",
          formatter: e =>
            e.status == 0
              ? "Pending Review"
              : e.status == 1
              ? "Withdrawal Accomplish"
              : e.status == 2
              ? "Review Reject"
              : e.status == 3
              ? "Withdrawal Failure"
              : "--"
        },
        { label: "Withdrawal Time", prop: "ctime" },
        { label: "Review Remarks", prop: "remark" },
        // { label: '审核人', prop: 'checkUser' },
        { label: "Audit Time", prop: "checkTime" },
        {
          label: "Operations",
          type: "button",
          width: 200,
          btnList: [
            {
              label: "Pass",
              type: "text",
              isShow: e => e.status == 0,
              handle: row => {
                this.$confirm(
                  "Are you sure about the commission withdrawal application?",
                  "Hint",
                  {
                    confirmButtonText: "Confirm",
                    cancelButtonText: "Cancel",
                    type: "warning"
                  }
                )
                  .then(async () => {
                    this.formData.id = row.id;
                    this.formData.result = 1;
                    this.renewalShow = true;
                    this.formData.remark = "";
                    this.renewalTitle = "Pass commission withdrawal";
                  })
                  .catch(() => {});
              }
            },
            {
              label: "No Pass",
              type: "text",
              isShow: e => e.status == 0,
              handle: row => {
                this.formData.id = row.id;
                this.formData.result = 2;
                this.renewalShow = true;
                this.formData.remark = "";
                this.renewalTitle = "Reject commission withdrawal";
              }
            },
            {
              label: "Heavy Salary Withdrawal",
              type: "text",
              isShow: e => e.status == 3,
              handle: row => {
                this.$confirm(
                  "Are you sure to re-initiate the commission withdrawal application?",
                  "Hint",
                  {
                    confirmButtonText: "Confirm",
                    cancelButtonText: "Cancel",
                    type: "warning"
                  }
                )
                  .then(async () => {
                    const res = await this.apis.userWithdrawRecordReWithdraw({
                      id: row.id
                    });
                    this.$message({
                      type: res.code == 200 ? "success" : "error",
                      message: res.msg
                    });
                    this.getData();
                  })
                  .catch(() => {});
              }
            },
            {
              label: "Offline transfer",
              type: "text",
              isShow: e => (e.status == 1 ? false : true),
              handle: async row => {
                const res = await this.apis.userWithdrawRecordOffLineTransFel(
                  row.id
                );
                this.$message({
                  type: res.code == 200 ? "success" : "error",
                  message: res.msg
                });
                this.getData();
              }
            }
          ]
        }
      ],
      tableHandles: [
        // {
        //   label: "Export",
        //   type: "primary",
        //   handle: e => this.elFormVisible()
        // },
      ],
      pagination: { limit: 10, offset: 1, total: 0 },
      renewalShow: false,
      renewalTitle: "",
      formData: {
        id: "",
        result: null, //审核结果 1 Pass 2拒绝
        remark: "" //审核Remarks
      },
      formRules: {
        remark: [{ required: true, message: "Please Enter", trigger: "blur" }]
      }
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    zeroFn() {
      this.pagination.limit = 10;
      this.pagination.offset = 1;
      this.pagination.total = 0;
    },
    // 审核确认按钮
    affirmAgentFn(formName) {
      this.$refs[formName].validate(async valid => {
        if (valid) {
          console.log(321234, this.formData);
          const res = await this.apis.userWithdrawRecordCheck({
            id: this.formData.id,
            result: this.formData.result, //审核结果 1 Pass 2拒绝
            remark: this.formData.remark || "" //审核Remarks
          });
          this.$message({
            type: res.code == 200 ? "success" : "error",
            message: res.msg
          });
          this.getData();
        }
      });
    },
    async getData() {
      let parm = {
        ...this.searchData,
        ...{
          pageNum: this.pagination.offset,
          pageSize: this.pagination.limit
        }
      };
      var res = await this.apis.userWithdrawRecordList(parm);
      var list = res.rows || [];

      this.tableData = list;
      this.pagination.total = res.total;
    },
    async elFormSubmit(row) {
      this.$refs.elForm.$refs.ruleForm.validate(async valid => {
        if (valid) {
          const res = await this.apis.depositReturn_check(this.formData);

          this.$message({
            message: "Operations Success！",
            type: "success"
          });
          this.getData();
          this.elFormVisible();
        }
      });
    },
    page() {
      this.getData();
    }
  }
};
</script>

<style scoped lang="scss"></style>
